import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15
import Login 1.0

ApplicationWindow {
    id: mainWindow
    width: 800
    height: 600
    visible: true
    title: "用户登录"
    
    Login {
        id: user
        onErrorMessage: errorText.text = errorMessage
        onLoginSuccess: {
            mainWindow.visibility = Window.FullScreen
            stackView.replace("qrc:/qt/qml/qtquickapplicationnew/homePage.qml")
        }
    }

    StackView {
        id: stackView
        anchors.fill: parent
        initialItem: loginPageComponent

        replaceEnter: Transition {
            PropertyAnimation {
                property: "x"
                from: parent.width
                to: 0
                duration: 400
                easing.type: Easing.OutBack
            }
        }
    }

    Component {
        id: loginPageComponent
        Rectangle {
            gradient: Gradient {
                GradientStop { position: 0.0; color: "#1a237e" }
                GradientStop { position: 1.0; color: "#000000" }
            }

            // Logo固定在左上角
            Image {
                id: logo
                width: 150
                height: 60
                anchors {
                    left: parent.left
                    top: parent.top
                    margins: 20
                }
                source: "qrc:/qt/qml/qtquickapplicationnew/icon/logo.jpg"
                fillMode: Image.PreserveAspectFit
            }

            // 主表单容器
            ColumnLayout {
                anchors.centerIn: parent
                spacing: 25
                width: parent.width * 0.6

                // 表单区域
                GridLayout {
                    columns: 2
                    columnSpacing: 20
                    rowSpacing: 25
                    Layout.fillWidth: true

                    // 账号行
                    Text {
                        text: "账号："
                        color: "white"
                        font.pixelSize: 14
                        Layout.alignment: Qt.AlignRight
                        Layout.fillWidth: true
                    }

                    TextFieldEx {
                        id: username
                        placeholder: "请输入用户名称"
                        validRegex: "^[a-zA-Z0-9_]{3,16}$"
                        errorMessage: "3-16位字母/数字/下划线"
                        onTextChanged: user.name = text
                        Layout.fillWidth: true
                    }

                    // 密码行
                    Text {
                        text: "密码："
                        color: "white"
                        font.pixelSize: 14
                        Layout.alignment: Qt.AlignRight
                    }

                    TextFieldEx {
                        id: passwordTextField
                        placeholder: "请输入密码"
                        isPassword: true
                        validRegex: "^(?=.*[A-Za-z])(?=.*\\d).{8,}$"
                        errorMessage: "需包含字母和数字，至少8位"
                        onTextChanged: user.password = text
                        Layout.fillWidth: true
                    }

                    // 错误提示
                    Text {
                        id: errorText
                        color: "#F70B0B"
                        font.pixelSize: 12
                        Layout.columnSpan: 2
                        Layout.alignment: Qt.AlignHCenter
                        horizontalAlignment: Text.AlignHCenter
                        verticalAlignment: Text.AlignVCenter
                    }
                }

                // 语言选择
                RowLayout {
                    Layout.alignment: Qt.AlignHCenter
                    spacing: 40  // 增加间距


                    
                    CustomCheckBox {
                        id: checkBoxChinese
                        text: "中文"
                        checked: true
                        checkedColor: "#D9000000"
                        boxSize: 20
                        font.pixelSize: 14
                        onClicked: console.log("选中中文:", checked)
    
                    }
                    
                    CustomCheckBox {
                        id: checkBoxEnglish
                        text: "英文"
                        checked: true
                        checkedColor: "#EC000000"
                        boxSize: 20
                        font.pixelSize: 14
                        onClicked: console.log("选中中文:", checked)
    
                    }
                }

                // 按钮区域
                RowLayout {
                    Layout.alignment: Qt.AlignHCenter
                    spacing: 30

                    AnimatedButton {
                        id: loginButton
                        text: "登录"
                        onClicked: user.loginUser()
                        borderRadius: 8
                        Layout.preferredWidth: 140
                        Layout.preferredHeight: 40
                    }

                    AnimatedButton {
                        id: cancelButton
                        text: "取消"
                        onClicked: Qt.quit()
                        borderRadius: 8
                        Layout.preferredWidth: 140
                        Layout.preferredHeight: 40
                    }
                }
            }
        }
    }
}